<template>
    <div class="box-card">
        <div class="card-header">
            <span>{{ curRouteName }}</span>
        </div>
        <div class="box-content">

            <el-form ref="form" :model="formData" :rules="formRules" label-width="120px" label-position="right">
                <el-row :gutter="20">
                    <el-col :span="8">
                        <el-form-item label="设备型号" prop="deviceModel">
                            <el-input v-model="formData.deviceModel"></el-input>
                        </el-form-item>

                        <el-form-item label="设备编码" prop="deviceSN">
                            <el-input v-model="formData.deviceSN"></el-input>
                        </el-form-item>

                        <el-form-item label="软件版本" prop="softwareVersion">
                            <el-input v-model="formData.softwareVersion"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <!-- <el-row :gutter="20">
                    <el-col :span="8">
                        <el-form-item label="打印等级" prop="printLevel">
                            <el-select v-model="formData.printLevel" style="width: 100%;">
                                <el-option label="0级" value="0"></el-option>
                                <el-option label="1级" value="1"></el-option>
                                <el-option label="2级" value="2"></el-option>
                                <el-option label="3级" value="3"></el-option>
                                <el-option label="4级" value="4"></el-option>
                            </el-select>

                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <div class="notes-text">0:CLOSE 1:ERR 2:WAR 3:INFO 4:DEBUG</div>
                    </el-col>
                </el-row>
                <el-row :gutter="20">
                    <el-col :span="8">
                        <el-form-item label="工作模式" prop="workMode">
                            <el-select v-model="formData.workMode" style="width: 100%;">
                                <el-option label="兼容" value="0"></el-option>
                                <el-option label="自报" value="1"></el-option>
                                <el-option label="查询/应答" value="2"></el-option>
                                <el-option label="调试/维修" value="3"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row> -->

                <el-form-item>
                    <el-button type="primary" @click="submitForm">保 存</el-button>
                </el-form-item>
            </el-form>

        </div>
    </div>
    <Clock></Clock>
</template>

<script setup lang="ts">
import { useRoute } from 'vue-router'
import { onMounted, ref, computed } from 'vue'
import Clock from '@/views/system/terminal/clock.vue'
//获取路由对象
let $route = useRoute()
// 计算出当前路由名称
let curRouteName = computed(() => {
    return $route.matched[$route.matched.length - 1].meta.title
})
onMounted(() => { })

const form = ref(null)
const formData = ref({
    deviceModel: 'xk001',
    deviceSN: 'sn001',
    softwareVersion: 'V1.0',
    printLevel: '0',
    workMode: '0',
});
const formRules = {
    deviceModel: [{ required: true, message: '设备型号不能为空', trigger: 'blur' }],
    deviceSN: [{ required: true, message: '设备SN不能为空', trigger: 'blur' }],
    softwareVersion: [{ required: true, message: '软件版本不能为空', trigger: 'blur' }],
    printLevel: [{ required: true, message: '打印等级不能为空', trigger: 'change' }],
    workMode: [{ required: true, message: '工作模式不能为空', trigger: 'change' }],
};



const submitForm = () => {
    form.value.validate((valid: boolean) => {
        if (valid) {
            // 表单验证通过，可以进行提交操作
            // ...
        } else {
            // 表单验证不通过，进行错误处理
            return false;
        }
    });
};


</script>

<style scoped lang></style>